<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div id="sampleId">

    <ul>
        <li>foreach value</li>
        <li v-for="val in Person">{{val}}</li>
    </ul>
    <ul>
        <li>foreach value, key</li>
        <li v-for="val, k in Person">{{k}} : {{val}}</li>
    </ul>
    <ul>
        <li>foreach value, key</li>
        <li v-for="val, k, indx in Person">{{indx}} - {{k}} : {{val}}</li>
    </ul>
</div>
<br>
<br>
<br>
<br>
</body>
<script src="layout/scripts/vue.js"></script>
<script type="application/javascript">
    var sample = new Vue({
        el: "#sampleId",
        data: {
            Person:{
                name:"kid",
                mobile:"13912607770",
                age:28,
                gender:"Male",
                location:"Jiangsu"
            }
        }
    });


</script>
</html>